$(function() {
    // 登录模块
    // getlogin()

    function getlogin() {
        $.ajax({
            method: 'POST',
            url: '/api/login',
            data: {
                username: 'admin',
                password: 'admin'
            },

            success: function(res) {
                if (res.status !== 0) {
                    return console.log(res.message);
                }
                // console.log(res);
                // console.log(res.token);
                localStorage.setItem('token', res.token)

            }
        })
    }
    getSwiperList()
    var layer = layui.layer


    function getSwiperList() {
        $.ajax({
            method: "GET",
            url: "/admin/swipers",
            success: function(res) {
                // console.log(res.data);
                // 渲染数据


                // res.data.forEach(element => {
                //     console.log(element.swiperstatus);
                //     if (element.swiperstatus === 1) {

                //         $('#choose').html(`<span class="layui-badge layui-bg-green btn_true">√</span>`)
                //     } else if (element.swiperstatus === 2) {
                //         $('#choose').html(`<span class="layui-badge layui-bg-cyan btn_close">×</span>`)
                //     }
                // });

                var htmlStr = template('tpl-table', res)
                $('tbody').html(htmlStr)
            }
        })
    }



    //修改轮播图状态
    let flag = true;
    let d = null;
    $('tbody').on('click', '.layui-badge', function() {
        var id = $(this).attr('data-id')
            // console.log(id);
            // var swiperstatus = $(this).attr('data-status')
            // console.log(swiperstatus);
        if (flag) {
            d = 1;
            flag = false;
        } else {
            d = 2;
            flag = true;

        }

        $.ajax({
            method: "PUT",
            url: '/admin/swipers/' + id,
            data: {
                status: d,
            },
            success: function(res) {
                console.log(res);
                console.log(res.message);
                if (res.status !== 0) {
                    return layer.msg("切换轮播图状态失败！")
                }
                layer.msg("切换轮播图状态成功！")
                    // $(this).hide().silblings().show()
                    // .hide()
                getSwiperList()
            }



        })





    })
    var $image = $('#image')
        //实现上传图片功能
    $('#uploadSwiper').on('click', function() {
        $('#myfile').click()
    })
    var file = null
    $('#myfile').on('change', function(e) {
        var fd = new FormData() // 获取文件的列表数据

        var files = e.target.files
            // console.log(files);
            // 判断用户是否选择了文件
        if (files.length === 0) {
            return
        }
        // 根据文件，创建对应的URL 地址
        var newImgURL = URL.createObjectURL(files[0])
            // 为裁剪区域重新设置图片
        $image.attr('src', newImgURL)
        file = files[0]
        for (var i = 0; i < files.length; i++) {
            fd.append('swipers', files[i])
        }
        console.log(fd);
        publishSwiper(fd)

    })

    function publishSwiper(fd) {
        // 需要  formData 请求数据
        $.ajax({
            method: 'POST',
            url: '/admin/swipers',
            data: fd,
            contentType: false,
            processData: false,
            success: function(res) {
                if (res.status !== 0) {
                    return layer.msg('上传轮播图失败！')
                }
                layer.msg('上传轮播图成功！')
                getSwiperList()
            }

        })
    }

    //实现删除功能
    $('tbody').on('click', '.btn-delete', function() {
        var id = $(this).attr('data-id')
        layer.confirm('确认删除?', { icon: 3, title: '提示' }, function(index) {
            $.ajax({
                method: 'DELETE',
                url: '/admin/swipers/' + id,
                success: function(res) {
                    if (res.status !== 0) {
                        return layer.msg('删除轮播图失败！')
                    }
                    layer.msg('删除轮播图成功！')
                    layer.close(index)
                    getSwiperList()
                }
            })
        })
    })


})